import React from 'react';
import {BrowserRouter as Router, Routes, Route, Link} from 'react-router-dom';
import './App.css';
import Demo from './pages/demo/index'

function App() {
    return (
        <Router>
            <div className="App">
                <nav style={{backgroundColor: 'pink'}}>
                    <ul>
                        <li><Link to="/about">About</Link></li>
                        <li><Link to="/pages/demo">Demo</Link></li>
                    </ul>
                </nav>

                <div style={{backgroundColor: '#bfa'}}>
                    <Routes>
                        <Route path="/about" element={<About/>}/>
                        <Route path="/pages/demo" element={<Demo/>}/>
                    </Routes>
                </div>
            </div>
        </Router>
    );
}

function About() {
    return <h2>About</h2>;
}

export default App;
